<template>
	<view class="content">
		<view class="box"
			:style='{"padding":"60rpx 120rpx","boxShadow":" 0px 6rpx 12rpx rgba(0, 0, 0, 0.16)","margin":"0 5%","borderColor":"#ccc","backgroundColor":"rgba(255, 255, 255, 0)","borderRadius":"0","borderWidth":"0","width":"90%","borderStyle":"solid","height":"auto"}'>
			<view class="logo"
				:style='{"padding":"0","boxShadow":"0 2rpx 12rpx rgba(0,0,0,0)","margin":"0 0 24rpx","borderColor":"#ccc","backgroundColor":"rgba(255, 255, 255, 0)","borderRadius":"0","borderWidth":"0","width":"100%","borderStyle":"solid","height":"auto"}'
				v-if="true">
				<image
					:style='{"padding":"0","boxShadow":"0 0 0px #59f43e","margin":"0 auto","borderColor":"#ccc","borderRadius":"40rpx","borderWidth":"0","width":"160rpx","borderStyle":"solid","url":"http://codegen.caihongy.cn/20220211/2eff605617a840bcb954b9faaabcf77b.jfif","isShow":true,"height":"160rpx"}'
					src='http://codegen.caihongy.cn/20220211/2eff605617a840bcb954b9faaabcf77b.jfif' mode="aspectFill">
				</image>
			</view>
			<view
				:style='{"padding":"0","boxShadow":"0 2rpx 12rpx rgba(0,0,0,0)","margin":"0 0 24rpx","borderColor":"#ccc","backgroundColor":"rgba(255, 255, 255, 0)","borderRadius":"0","borderWidth":"0","width":"100%","borderStyle":"solid","height":"auto"}'
				v-if="tableName=='xuesheng'" class="uni-form-item uni-column">
				<input
					:style='{"padding":"0 24rpx","boxShadow":"0 2rpx 12rpx rgba(0,0,0,0)","margin":"0","borderColor":"rgba(94, 143, 247, 1)","backgroundColor":"#fff","color":"#333","textAlign":"left","borderRadius":"16rpx","borderWidth":"4rpx","width":"100%","fontSize":"28rpx","borderStyle":"solid","height":"88rpx"}'
					v-model="ruleForm.xuehao" type="text" class="uni-input" name="" placeholder="学号" />
			</view>
			<view
				:style='{"padding":"0","boxShadow":"0 2rpx 12rpx rgba(0,0,0,0)","margin":"0 0 24rpx","borderColor":"#ccc","backgroundColor":"rgba(255, 255, 255, 0)","borderRadius":"0","borderWidth":"0","width":"100%","borderStyle":"solid","height":"auto"}'
				v-if="tableName=='xuesheng'" class="uni-form-item uni-column">
				<input
					:style='{"padding":"0 24rpx","boxShadow":"0 2rpx 12rpx rgba(0,0,0,0)","margin":"0","borderColor":"rgba(94, 143, 247, 1)","backgroundColor":"#fff","color":"#333","textAlign":"left","borderRadius":"16rpx","borderWidth":"4rpx","width":"100%","fontSize":"28rpx","borderStyle":"solid","height":"88rpx"}'
					v-model="ruleForm.mima" type="password" class="uni-input" name="" placeholder="密码" />
			</view>
			<view v-if="tableName=='xuesheng'" class="uni-form-item uni-column">
				<input
					:style='{"padding":"0 24rpx","boxShadow":"0 2rpx 12rpx rgba(0,0,0,0)","margin":"0","borderColor":"rgba(94, 143, 247, 1)","backgroundColor":"#fff","color":"#333","textAlign":"left","borderRadius":"16rpx","borderWidth":"4rpx","width":"100%","fontSize":"28rpx","borderStyle":"solid","height":"88rpx"}'
					v-model="ruleForm.mima2" type="password" class="uni-input" name="" placeholder="确认密码" />
			</view>
			<view
				:style='{"padding":"0","boxShadow":"0 2rpx 12rpx rgba(0,0,0,0)","margin":"0 0 24rpx","borderColor":"#ccc","backgroundColor":"rgba(255, 255, 255, 0)","borderRadius":"0","borderWidth":"0","width":"100%","borderStyle":"solid","height":"auto"}'
				v-if="tableName=='xuesheng'" class="uni-form-item uni-column">
				<input
					:style='{"padding":"0 24rpx","boxShadow":"0 2rpx 12rpx rgba(0,0,0,0)","margin":"0","borderColor":"rgba(94, 143, 247, 1)","backgroundColor":"#fff","color":"#333","textAlign":"left","borderRadius":"16rpx","borderWidth":"4rpx","width":"100%","fontSize":"28rpx","borderStyle":"solid","height":"88rpx"}'
					v-model="ruleForm.xueshengxingming" type="text" class="uni-input" name="" placeholder="学生姓名" />
			</view>
			<view
				:style='{"padding":"0","boxShadow":"0 2rpx 12rpx rgba(0,0,0,0)","margin":"0 0 24rpx","borderColor":"#ccc","backgroundColor":"rgba(255, 255, 255, 0)","borderRadius":"0","borderWidth":"0","width":"100%","borderStyle":"solid","height":"auto"}'
				v-if="tableName=='xuesheng'" class="uni-form-item uni-column">
				<picker @change="xueshengxingbieChange" :value="xueshengxingbieIndex" :range="xueshengxingbieOptions">
					<view
						:style='{"padding":"0 20rpx","boxShadow":"0 2rpx 12rpx rgba(0,0,0,0)","margin":"0","borderColor":"rgba(94, 143, 247, 1)","backgroundColor":"rgba(255, 255, 255, 1)","color":"rgba(135, 133, 133, 1)","textAlign":"left","borderRadius":"16rpx","borderWidth":"4rpx","width":"100%","lineHeight":"80rpx","fontSize":"28rpx","borderStyle":"solid"}'
						class="uni-input">{{ruleForm.xingbie?ruleForm.xingbie:"请选择性别"}}</view>
				</picker>
			</view>
			<view
				:style='{"padding":"0","boxShadow":"0 2rpx 12rpx rgba(0,0,0,0)","margin":"0 0 24rpx","borderColor":"#ccc","backgroundColor":"rgba(255, 255, 255, 0)","borderRadius":"0","borderWidth":"0","width":"100%","borderStyle":"solid","height":"auto"}'
				v-if="tableName=='xuesheng'" class="uni-form-item uni-column">
				<input
					:style='{"padding":"0 24rpx","boxShadow":"0 2rpx 12rpx rgba(0,0,0,0)","margin":"0","borderColor":"rgba(94, 143, 247, 1)","backgroundColor":"#fff","color":"#333","textAlign":"left","borderRadius":"16rpx","borderWidth":"4rpx","width":"100%","fontSize":"28rpx","borderStyle":"solid","height":"88rpx"}'
					v-model="ruleForm.nianling" type="text" class="uni-input" name="" placeholder="年龄" />
			</view>
			<view
				:style='{"padding":"0","boxShadow":"0 2rpx 12rpx rgba(0,0,0,0)","margin":"0 0 24rpx","borderColor":"#ccc","backgroundColor":"rgba(255, 255, 255, 0)","borderRadius":"0","borderWidth":"0","width":"100%","borderStyle":"solid","height":"auto"}'
				v-if="tableName=='xuesheng'" class="uni-form-item uni-column">
				<input
					:style='{"padding":"0 24rpx","boxShadow":"0 2rpx 12rpx rgba(0,0,0,0)","margin":"0","borderColor":"rgba(94, 143, 247, 1)","backgroundColor":"#fff","color":"#333","textAlign":"left","borderRadius":"16rpx","borderWidth":"4rpx","width":"100%","fontSize":"28rpx","borderStyle":"solid","height":"88rpx"}'
					v-model="ruleForm.lianxifangshi" type="text" class="uni-input" name="" placeholder="联系方式" />
			</view>
			<view
				:style='{"padding":"0","boxShadow":"0 2rpx 12rpx rgba(0,0,0,0)","margin":"0 0 24rpx","borderColor":"#ccc","backgroundColor":"rgba(255, 255, 255, 0)","borderRadius":"0","borderWidth":"0","width":"100%","borderStyle":"solid","height":"auto"}'
				v-if="tableName=='xuesheng'" class="uni-form-item uni-column">
				<input
					:style='{"padding":"0 24rpx","boxShadow":"0 2rpx 12rpx rgba(0,0,0,0)","margin":"0","borderColor":"rgba(94, 143, 247, 1)","backgroundColor":"#fff","color":"#333","textAlign":"left","borderRadius":"16rpx","borderWidth":"4rpx","width":"100%","fontSize":"28rpx","borderStyle":"solid","height":"88rpx"}'
					v-model="ruleForm.yuanxi" type="text" class="uni-input" name="" placeholder="院系" />
			</view>
			<view
				:style='{"padding":"0","boxShadow":"0 2rpx 12rpx rgba(0,0,0,0)","margin":"0 0 24rpx","borderColor":"#ccc","backgroundColor":"rgba(255, 255, 255, 0)","borderRadius":"0","borderWidth":"0","width":"100%","borderStyle":"solid","height":"auto"}'
				v-if="tableName=='xuesheng'" class="uni-form-item uni-column">
				<input
					:style='{"padding":"0 24rpx","boxShadow":"0 2rpx 12rpx rgba(0,0,0,0)","margin":"0","borderColor":"rgba(94, 143, 247, 1)","backgroundColor":"#fff","color":"#333","textAlign":"left","borderRadius":"16rpx","borderWidth":"4rpx","width":"100%","fontSize":"28rpx","borderStyle":"solid","height":"88rpx"}'
					v-model="ruleForm.nianji" type="text" class="uni-input" name="" placeholder="年级" />
			</view>
			<view
				:style='{"padding":"0","boxShadow":"0 2rpx 12rpx rgba(0,0,0,0)","margin":"0 0 24rpx","borderColor":"#ccc","backgroundColor":"rgba(255, 255, 255, 0)","borderRadius":"0","borderWidth":"0","width":"100%","borderStyle":"solid","height":"auto"}'
				v-if="tableName=='xuesheng'" class="uni-form-item uni-column">
				<input
					:style='{"padding":"0 24rpx","boxShadow":"0 2rpx 12rpx rgba(0,0,0,0)","margin":"0","borderColor":"rgba(94, 143, 247, 1)","backgroundColor":"#fff","color":"#333","textAlign":"left","borderRadius":"16rpx","borderWidth":"4rpx","width":"100%","fontSize":"28rpx","borderStyle":"solid","height":"88rpx"}'
					v-model="ruleForm.shezhangzhanghao" type="text" class="uni-input" name="" placeholder="学生账号" />
			</view>
			<view
				:style='{"padding":"0","boxShadow":"0 2rpx 12rpx rgba(0,0,0,0)","margin":"0 0 24rpx","borderColor":"#ccc","backgroundColor":"rgba(255, 255, 255, 0)","borderRadius":"0","borderWidth":"0","width":"100%","borderStyle":"solid","height":"auto"}'
				v-if="tableName=='shezhang'" class="uni-form-item uni-column">
				<input
					:style='{"padding":"0 24rpx","boxShadow":"0 2rpx 12rpx rgba(0,0,0,0)","margin":"0","borderColor":"rgba(94, 143, 247, 1)","backgroundColor":"#fff","color":"#333","textAlign":"left","borderRadius":"16rpx","borderWidth":"4rpx","width":"100%","fontSize":"28rpx","borderStyle":"solid","height":"88rpx"}'
					v-model="ruleForm.shezhangzhanghao" type="text" class="uni-input" name="" placeholder="社长账号" />
			</view>
			<view
				:style='{"padding":"0","boxShadow":"0 2rpx 12rpx rgba(0,0,0,0)","margin":"0 0 24rpx","borderColor":"#ccc","backgroundColor":"rgba(255, 255, 255, 0)","borderRadius":"0","borderWidth":"0","width":"100%","borderStyle":"solid","height":"auto"}'
				v-if="tableName=='shezhang'" class="uni-form-item uni-column">
				<input
					:style='{"padding":"0 24rpx","boxShadow":"0 2rpx 12rpx rgba(0,0,0,0)","margin":"0","borderColor":"rgba(94, 143, 247, 1)","backgroundColor":"#fff","color":"#333","textAlign":"left","borderRadius":"16rpx","borderWidth":"4rpx","width":"100%","fontSize":"28rpx","borderStyle":"solid","height":"88rpx"}'
					v-model="ruleForm.mima" type="password" class="uni-input" name="" placeholder="密码" />
			</view>
			<view v-if="tableName=='shezhang'" class="uni-form-item uni-column">
				<input
					:style='{"padding":"0 24rpx","boxShadow":"0 2rpx 12rpx rgba(0,0,0,0)","margin":"0","borderColor":"rgba(94, 143, 247, 1)","backgroundColor":"#fff","color":"#333","textAlign":"left","borderRadius":"16rpx","borderWidth":"4rpx","width":"100%","fontSize":"28rpx","borderStyle":"solid","height":"88rpx"}'
					v-model="ruleForm.mima2" type="password" class="uni-input" name="" placeholder="确认密码" />
			</view>
			<view
				:style='{"padding":"0","boxShadow":"0 2rpx 12rpx rgba(0,0,0,0)","margin":"0 0 24rpx","borderColor":"#ccc","backgroundColor":"rgba(255, 255, 255, 0)","borderRadius":"0","borderWidth":"0","width":"100%","borderStyle":"solid","height":"auto"}'
				v-if="tableName=='shezhang'" class="uni-form-item uni-column">
				<input
					:style='{"padding":"0 24rpx","boxShadow":"0 2rpx 12rpx rgba(0,0,0,0)","margin":"0","borderColor":"rgba(94, 143, 247, 1)","backgroundColor":"#fff","color":"#333","textAlign":"left","borderRadius":"16rpx","borderWidth":"4rpx","width":"100%","fontSize":"28rpx","borderStyle":"solid","height":"88rpx"}'
					v-model="ruleForm.shezhangxingming" type="text" class="uni-input" name="" placeholder="社长姓名" />
			</view>
			<view
				:style='{"padding":"0","boxShadow":"0 2rpx 12rpx rgba(0,0,0,0)","margin":"0 0 24rpx","borderColor":"#ccc","backgroundColor":"rgba(255, 255, 255, 0)","borderRadius":"0","borderWidth":"0","width":"100%","borderStyle":"solid","height":"auto"}'
				v-if="tableName=='shezhang'" class="uni-form-item uni-column">
				<picker @change="shezhangxingbieChange" :value="shezhangxingbieIndex" :range="shezhangxingbieOptions">
					<view
						:style='{"padding":"0 20rpx","boxShadow":"0 2rpx 12rpx rgba(0,0,0,0)","margin":"0","borderColor":"rgba(94, 143, 247, 1)","backgroundColor":"rgba(255, 255, 255, 1)","color":"rgba(135, 133, 133, 1)","textAlign":"left","borderRadius":"16rpx","borderWidth":"4rpx","width":"100%","lineHeight":"80rpx","fontSize":"28rpx","borderStyle":"solid"}'
						class="uni-input">{{ruleForm.xingbie?ruleForm.xingbie:"请选择性别"}}</view>
				</picker>
			</view>
			<view
				:style='{"padding":"0","boxShadow":"0 2rpx 12rpx rgba(0,0,0,0)","margin":"0 0 24rpx","borderColor":"#ccc","backgroundColor":"rgba(255, 255, 255, 0)","borderRadius":"0","borderWidth":"0","width":"100%","borderStyle":"solid","height":"auto"}'
				v-if="tableName=='shezhang'" class="uni-form-item uni-column">
				<input
					:style='{"padding":"0 24rpx","boxShadow":"0 2rpx 12rpx rgba(0,0,0,0)","margin":"0","borderColor":"rgba(94, 143, 247, 1)","backgroundColor":"#fff","color":"#333","textAlign":"left","borderRadius":"16rpx","borderWidth":"4rpx","width":"100%","fontSize":"28rpx","borderStyle":"solid","height":"88rpx"}'
					v-model="ruleForm.nianling" type="text" class="uni-input" name="" placeholder="年龄" />
			</view>
			<view
				:style='{"padding":"0","boxShadow":"0 2rpx 12rpx rgba(0,0,0,0)","margin":"0 0 24rpx","borderColor":"#ccc","backgroundColor":"rgba(255, 255, 255, 0)","borderRadius":"0","borderWidth":"0","width":"100%","borderStyle":"solid","height":"auto"}'
				v-if="tableName=='shezhang'" class="uni-form-item uni-column">
				<input
					:style='{"padding":"0 24rpx","boxShadow":"0 2rpx 12rpx rgba(0,0,0,0)","margin":"0","borderColor":"rgba(94, 143, 247, 1)","backgroundColor":"#fff","color":"#333","textAlign":"left","borderRadius":"16rpx","borderWidth":"4rpx","width":"100%","fontSize":"28rpx","borderStyle":"solid","height":"88rpx"}'
					v-model="ruleForm.lianxifangshi" type="text" class="uni-input" name="" placeholder="联系方式" />
			</view>
			<view
				:style='{"padding":"0","boxShadow":"0 2rpx 12rpx rgba(0,0,0,0)","margin":"0 0 24rpx","borderColor":"#ccc","backgroundColor":"rgba(255, 255, 255, 0)","borderRadius":"0","borderWidth":"0","width":"100%","borderStyle":"solid","height":"auto"}'
				v-if="tableName=='shezhang'" class="uni-form-item uni-column">
				<picker @change="shezhangshetuanmingchengChange" :value="shezhangshetuanmingchengIndex"
					:range="shezhangshetuanmingchengOptions">
					<view
						:style='{"padding":"0 20rpx","boxShadow":"0 2rpx 12rpx rgba(0,0,0,0)","margin":"0","borderColor":"rgba(94, 143, 247, 1)","backgroundColor":"rgba(255, 255, 255, 1)","color":"rgba(135, 133, 133, 1)","textAlign":"left","borderRadius":"16rpx","borderWidth":"4rpx","width":"100%","lineHeight":"80rpx","fontSize":"28rpx","borderStyle":"solid"}'
						class="uni-input">{{ruleForm.shetuanmingcheng?ruleForm.shetuanmingcheng:"请选择社团名称"}}</view>
				</picker>
			</view>
			<button class="btn-submit" @tap="register" type="primary"
				:style='{"padding":"0","boxShadow":"0 2rpx 12rpx rgba(0,0,0,0)","margin":"0","borderColor":"#ccc","backgroundColor":"rgba(123, 120, 244, 1)","borderRadius":"8rpx","color":"rgba(255, 255, 255, 1)","borderWidth":"0","width":"100%","fontSize":"32rpx","borderStyle":"solid","height":"88rpx"}'>注册</button>
		</view>
	</view>
</template>

<style>
	.btn-submit {
		height: auto !important;
		line-height: 88rpx;
	}
</style>
<script>
	export default {
		data() {
			return {
				xueshengxingbieOptions: [],
				xueshengxingbieIndex: 0,
				shezhangxingbieOptions: [],
				shezhangxingbieIndex: 0,
				shezhangshetuanmingchengOptions: [],
				shezhangshetuanmingchengIndex: 0,
				ruleForm: {},
				emailcode: "",
				tableName: ""
			}
		},
		async onLoad() {
			let res = [];
			let table = uni.getStorageSync("loginTable");
			this.tableName = table;

			// 自定义下拉框值
			if (this.tableName == 'xuesheng') {
				this.xueshengxingbieOptions = "男,女".split(',');
				this.ruleForm.xingbie = this.xueshengxingbieOptions[0]
			}
			// 自定义下拉框值
			if (this.tableName == 'shezhang') {
				this.shezhangxingbieOptions = "男,女".split(',');
				this.ruleForm.xingbie = this.shezhangxingbieOptions[0]
			}
			if (this.tableName == 'shezhang') {
				res = await this.$api.option(`remenshetuan`, `shetuanmingcheng`, {});
				this.shezhangshetuanmingchengOptions = res.data;
				this.ruleForm.shetuanmingcheng = this.shezhangshetuanmingchengOptions[0]
			}

			this.styleChange()
		},
		methods: {

			// 下拉变化
			xueshengxingbieChange(e) {
				this.xueshengxingbieIndex = e.target.value
				this.ruleForm.xingbie = this.xueshengxingbieOptions[this.xueshengxingbieIndex]
			},
			// 下拉变化
			shezhangxingbieChange(e) {
				this.shezhangxingbieIndex = e.target.value
				this.ruleForm.xingbie = this.shezhangxingbieOptions[this.shezhangxingbieIndex]
			},
			// 下拉变化
			shezhangshetuanmingchengChange(e) {
				this.shezhangshetuanmingchengIndex = e.target.value
				this.ruleForm.shetuanmingcheng = this.shezhangshetuanmingchengOptions[this.shezhangshetuanmingchengIndex]
			},

			styleChange() {
				this.$nextTick(() => {
					// document.querySelectorAll('.uni-input .uni-input-input').forEach(el=>{
					//   el.style.backgroundColor = this.registerFrom.content.input.backgroundColor
					// })
				})
			},
			// 获取uuid
			getUUID() {
				return new Date().getTime();
			},
			// 注册
			async register() {
				if ((!this.ruleForm.xuehao) && `xuesheng` == this.tableName) {
					this.$utils.msg(`学号不能为空`);
					return
				}
				if (`xuesheng` == this.tableName && (this.ruleForm.xuehao.length < 3)) {
					this.$utils.msg(`学号长度不能小于3`);
					return
				}
				if (`xuesheng` == this.tableName && (this.ruleForm.xuehao.length > 10)) {
					this.$utils.msg(`学号长度不能大于10`);
					return
				}
				if ((!this.ruleForm.mima) && `xuesheng` == this.tableName) {
					this.$utils.msg(`密码不能为空`);
					return
				}
				if (`xuesheng` == this.tableName && (this.ruleForm.mima.length < 3)) {
					this.$utils.msg(`密码长度不能小于3`);
					return
				}
				if (`xuesheng` == this.tableName && (this.ruleForm.mima.length > 10)) {
					this.$utils.msg(`密码长度不能大于10`);
					return
				}
				if (`xuesheng` == this.tableName && (this.ruleForm.mima != this.ruleForm.mima2)) {
					this.$utils.msg(`两次密码输入不一致`);
					return
				}
				if (`xuesheng` == this.tableName && this.ruleForm.lianxifangshi && (!this.$validate.isMobile(this
						.ruleForm.lianxifangshi))) {
					this.$utils.msg(`联系方式应输入手机格式`);
					return
				}
				if ((!this.ruleForm.shezhangzhanghao) && `shezhang` == this.tableName) {
					this.$utils.msg(`社长账号不能为空`);
					return
				}
				if ((!this.ruleForm.mima) && `shezhang` == this.tableName) {
					this.$utils.msg(`密码不能为空`);
					return
				}
				if (`shezhang` == this.tableName && (this.ruleForm.mima != this.ruleForm.mima2)) {
					this.$utils.msg(`两次密码输入不一致`);
					return
				}
				if (`shezhang` == this.tableName && this.ruleForm.nianling && (!this.$validate.isIntNumer(this.ruleForm
						.nianling))) {
					this.$utils.msg(`年龄应输入整数`);
					return
				}
				if (`shezhang` == this.tableName && this.ruleForm.lianxifangshi && (!this.$validate.isMobile(this
						.ruleForm.lianxifangshi))) {
					this.$utils.msg(`联系方式应输入手机格式`);
					return
				}
				await this.$api.register(`${this.tableName}`, this.ruleForm, this.emailcode);
				this.$utils.msgBack('注册成功');;
			}
		}
	}
</script>

<style lang="scss" scoped>
	$color-primary: #b49950;

	.content {
		height: calc(100vh - 44px);
		overflow: auto;
	}

	.content:after {
		position: fixed;
		top: 0;
		right: 0;
		left: 0;
		bottom: 0;
		content: '';
		//background-image: url(http://codegen.caihongy.cn/20220214/4d1d425b19604a72b7b906cf4125e971.png);
		background-attachment: fixed;
		background-size: cover;
		background-position: center;
	}

	.logo {
		text-align: center;

		image {
			height: 200upx;
			width: 200upx;
			margin: 0 0 60upx;
		}
	}

	.uni-form-item {
		margin-bottom: 40upx;
		padding: 0;

		.uni-input {
			font-size: 30upx;
			padding: 7px 0;
		}
	}

	button[type="primary"] {
		background-color: $color-primary;
		border-radius: 0;
		font-size: 34upx;
		margin-top: 60upx;
	}

	.links {
		text-align: center;
		margin-top: 40upx;
		font-size: 26upx;
		color: #999;

		view {
			display: inline-block;
			vertical-align: top;
			margin: 0 10upx;
		}

		.link-highlight {
			color: $color-primary
		}
	}

	.picker-select-input {
		line-height: 88rpx;
	}
</style>
